$(function(){
 // 轮播图下一张按钮
      var next_button=$(".next_button")
      var $container_words=$('.container-words h2')
      console.log();
      let index=0
      next_button.click(function(){
          if (index==2) {
              index=1;
          $('.wrapper').css({
              left:0
          })
          }else{
              index++;
          }
          $container_words.removeClass("active")
          $( $container_words[index]).addClass(' active') 
          $('.wrapper')
          .stop(true)
          .animate({
          left:-1263*index
              
          },1000)
          
         
      })
      // 轮播图上一张按钮
      $('.prev_button').click(function(){
          if (index==0) {
              index=1;
          $('.wrapper').css({
              left:-2526
          })
          }else{
              index--;
          }
          $container_words.removeClass("active")
          $( $container_words[index]).addClass(' active') 
          $('.wrapper')
          .stop(true)
          .animate({
              left:-1263*index
              
          },1000)
    // 商品的样式选项卡 
      })
      let $head_Search_conten_ul_li = $(".head-Search-conten ul li");   
      let $commodity_content_content = $(".commodity-content-content");
      let $zhu_ye=$(".zhu-ye")
      let $hide_content=$('.hide-content')
      //绑定点击事件
      for( let i = 0 ; i < $head_Search_conten_ul_li.length ; i ++){
            $head_Search_conten_ul_li[i].onclick = function(){
                $head_Search_conten_ul_li.removeClass("active");
                $commodity_content_content.removeClass("active");
                //打印的是对应元素
                $($head_Search_conten_ul_li[i]).addClass(" active");
                $($commodity_content_content[i]).addClass(" active");
                $($zhu_ye).addClass(" active");
                $($hide_content).addClass(" active");
                    var $commodity_content_left_li= $($commodity_content_content[i]).children('.commodity-content-left1').children('ul').children('li')
                    var $commodity_content_right=$($commodity_content_content[i]).children('.commodity-content-right1').children('.commodity-content-right-content1')
                    // var $commodity_content_rightContent1=$('.commodity-content-rightContent1')
                  
                    for( let i = 0 ; i <$commodity_content_left_li.length ; i ++){
                        $commodity_content_left_li[i].onclick = function(){
                        $commodity_content_right.removeClass("active");
                            //打印的是对应元素
                            // $($commodity_content_rightContent1[i]).addClass(" active");  
                           
                            $( $commodity_content_left_li[i]).addClass(" active");
                            $( $commodity_content_right[i]).addClass(" active");
                                  
                        }
            }
            
            }
        }
        // 内容左边选项卡
    var $head_SignIn_right_li=$(".head-SignIn-right-li")
    var $box_big=$("box-big")
    $head_SignIn_right_li[0].onclick=function(){
        $box_big.show()
        $zhu_ye.hide()
    }
    // 内容右面选项卡
//   恢复主页
    var $head_Search_log=$('.head-Search-log')
    $head_Search_log[0].onclick=function(){
        $commodity_content_content.removeClass("active");
        $hide_content.removeClass("active");
        $head_Search_conten_ul_li.removeClass("active");
        $($zhu_ye).removeClass("active");
    }
//   底部选项卡
  var $container_div=$('.container-div div')
    for(let i=0;i< $container_div.length;i++){
        $container_div[i].onclick=function(){
            $container_div.removeClass('active')
            $( $container_div[i]).addClass('active')

        }
    }
  
  })
  // 轮播图自动按钮
  var next_button = document.querySelector(".next_button");
  var container = document.querySelector(".container");
  var t = setInterval( function(){
      next_button.dispatchEvent( new Event("click"));
 } , 3000 );

// 用户在操作轮播图的时候我们需要停止自动播放; 

container.onmouseover = function(){
      clearInterval( t );
}
container.onmouseout = function(){
      // 定时器关闭之后就不能重新开启了; 
      t = setInterval( function(){
            next_button.dispatchEvent( new Event("click"));
      } , 3000 );
}
